<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>下拉列表</title>
<style>
form{width:500px;margin:20px auto;}
select{margin-bottom:50px;width:80px;height:40px;text-align:center;font-size:16px;display:block;}
#demo2{border:1px solid blue;color:blue;border-radius:24px;}
#demo3{height:auto;}
#demo4{}
</style>
<script>

</script>
</head>
<body>
<form><p>下面这些表单都是由select标签做的，要是想下拉表单漂亮一点，可以使用li标签自定义下拉按钮组合</p>
	<select id="demo1" name="select_choice">
		<option value="全部">全部</option>
		<option value="篮球">篮球</option>
		<option value="足球">足球</option>
		<option value="田径">田径</option>
		<option value="赛车">赛车</option>
	</select>
	<select id="demo2" name="select_choice">
		<option value="全部">全部</option>
		<option value="篮球">篮球</option>
		<option value="足球">足球</option>
		<option value="田径">田径</option>
		<option value="赛车">赛车</option>
	</select>
	<select id="demo3" name="select_choice" size="5" >
		<option value="全部">全部</option>
		<option value="篮球">篮球</option>
		<option value="足球">足球</option>
		<option value="田径">田径</option>
		<option value="赛车">赛车</option>
	</select>
	<select id="demo4" name="select_choice" size="1" multiple="multiple">
		<option value="全部">全部</option>
		<option value="篮球">篮球</option>
		<option value="足球">足球</option>
		<option value="田径">田径</option>
		<option value="赛车">赛车</option>
	</select>
</form>
</body>
</html>